<template>
	<view class="container">
		<view class="bianji" @click="bj">编辑</view>
		<view class="percenter">
			<view class="bgc">
				<image :src="img"></image>
				<view class="shadow">
				</view>
				<view class="photo">
					<image :src="persionList.imageUrl=='' || persionList.imageUrl==null?'../../static/wodi.png':persionList.imageUrl"
					 mode="aspectFill"></image>
				</view>
			</view>
			<view>
				<h3>学员信息</h3>
			</view>
			<view class="merbinfo">
				<view class="top">
					<view>
						<p class="title">姓名</p>
						<p class="contd">{{userList.realName=='' || userList.realName==null?'------':userList.realName}}</p>
					</view>
					<view>
						<p class="title">性别</p>
						<p class="contd">{{userList.sex=='' || userList.sex==null?'------':userList.sex}}</p>
					</view>
				</view>
				<view class="bottom">
					<view>
						<p class="title">学员编号</p>
						<p class="contd">{{userList.phone=='' || userList.phone==null?'------':userList.phone}}</p>
					</view>
					<view>
						<p class="title">所在地</p>
						<p class="contd">{{userList.address=='' || userList.address==null?'------':userList.address}}</p>
					</view>
				</view>
				<view class="bottom">
					<view>
						<p class="title">学校</p>
						<p class="contd">{{userList.school=='' || userList.school==null?'------':userList.school}}</p>
					</view>
					<view>
						<p class="title">曾就读学校</p>
						<p class="contd">{{userList.onceSchool=='' || userList.onceSchool==null?'------':userList.onceSchool}}</p>
					</view>
				</view>
				<view class="bottom">
					<view>
						<p class="title">年级</p>
						<p class="contd">{{userList.grade=='' || userList.grade==null?'------':userList.grade}}</p>
					</view>
					<view>
						<p class="title">身份证号</p>
						<p class="contd">{{userList.idCard=='' || userList.idCard==null?'------':userList.idCard}}</p>
					</view>
				</view>
				<view>
					<p class="title">邮寄地址</p>
					<p class="contd">{{userList.mailAddress=='' || userList.mailAddress==null?'------':userList.mailAddress}}</p>
				</view>
			</view>
			<view>
				<h3>教师信息</h3>
			</view>
			<view class="merbinfo">
				<view class="bottom">
					<view>
						<p class="title">学校负责人</p>
						<p class="contd">{{userList.schoolPerson=='' || userList.schoolPerson==null?'------':userList.schoolPerson}}</p>
					</view>
					<view>
						<p class="title">电话</p>
						<p class="contd">{{userList.schoolPersonPhone=='' || userList.schoolPersonPhone==null?'------':userList.schoolPersonPhone}}</p>
					</view>
				</view>
				<view class="bottom">
					<view>
						<p class="title">辅导老师</p>
						<p class="contd">{{userList.leaderTeacher=='' || userList.leaderTeacher==null?'------':userList.leaderTeacher}}</p>
					</view>
					<view>
						<p class="title">电话</p>
						<p class="contd">{{userList.leaderTeacherPhone=='' || userList.leaderTeacherPhone==null?'------':userList.leaderTeacherPhone}}</p>
					</view>
				</view>
				<view class="bottom">
					<view>
						<p class="title">家长</p>
						<p class="contd">{{userList.parent=='' || userList.parent==null?'------':userList.parent}}</p>
					</view>
					<view>
						<p class="title">电话</p>
						<p class="contd">{{userList.parentPhone==''|| userList.parentPhone==null? '------':userList.parentPhone}}</p>
					</view>
				</view>
			</view>
			<view>
				<h3>获奖信息</h3>
			</view>
			<view class="merbinfo">
				<view class="bottom">
					<view>
						<p class="title">考取的最高考核成绩</p>
						<p class="contd">{{userList.beatSimulatedPilot==''|| userList.beatSimulatedPilot==null?'------':userList.beatSimulatedPilot}}</p>
					</view>
					<view>
						<p class="title">考取的最高等级证书</p>
						<p class="contd">{{userList.bestNationCompetition==''|| userList.bestNationCompetition==null?'------':userList.bestNationCompetition}}</p>
					</view>
				</view>
			</view>
			<view class="qiang">
				<view @click="certificate">
					<image src="../../static/persion_02.png" mode="" class=".t-left"></image>
					<p>我的获奖证书</p>
				</view>
				<view @click="my_c">
					<image src="../../static/persion_04.png" mode="" class=".t-left"></image>
					<p>我的等级证书</p>
				</view>
				<view @click="mysign(userList.realName,userList.imageUrl)">
					<image src="../../static/persion_03.png" mode="" class=".t-left"></image>
					<p>我的报名</p>
				</view>
				<view @click="buylist(userList.imageUrl)">
					<image src="../../static/persion_05.png" mode="" class=".t-left"></image>
					<p>我的购买记录</p>
				</view>
				<view @click="houtai">
					<image src="../../static/persion_06.png" mode="" class=".t-left"></image>
					<p>后台管理</p>
				</view>
				<view @click="contact">
					<image src="../../static/persion_07.png" mode="" class=".t-left"></image>
					<p>联系我们</p>
				</view>

				<!-- <button @click="up">up</button>
				
				<button @click="simpleup">simpleup</button> -->
			</view>
		</view>
	</view>

</template>

<script>
	import {
		getuserInfo,
		getAllPicture,
		usersRole
	} from '../../apis'
	export default {
		data() {
			return {
				userList: {},
				persionList: {
					leaderTeacher: '',
					realName: '',
					school: '',
					grade: '',
					imageUrl: '',
					phone: '',
					sex: '',
					address: ''
				},
				img: ''
			}
		},
		onShow() {
			uni.showLoading({
				title: '加载中'
			});
			getAllPicture().then((res) => {
					let [err, data] = res
					// console.log(data)
					this.img = data.data.data[5].imageUrl;
					// console.log(data.data.data)
				}),
				getuserInfo().then((res) => {
					let [err, data] = res
					// console.log("学生信息为："+JSON.stringify(data) )
					// console.log("学生信息为："+JSON.stringify(data.data.data))
					this.userList = JSON.parse(JSON.stringify(data.data.data))
					// console.log(JSON.parse(JSON.stringify(data.data.data)))
					// console.log(this.userList.realName)
					this.persionList.leaderTeacher = data.data.data.leaderTeacher
					this.persionList.realName = data.data.data.realName
					this.persionList.school = data.data.data.school
					this.persionList.grade = data.data.data.grade
					this.persionList.imageUrl = data.data.data.imageUrl
					this.persionList.phone = data.data.data.phone
					this.persionList.sex = data.data.data.sex
					this.persionList.address = data.data.data.address
				})
			uni.hideLoading();
		},
		onPullDownRefresh() {
			getAllPicture().then((res) => {
					let [err, data] = res 
					// console.log(data)
					this.img = data.data.data[5].imageUrl;
					// console.log(data.data.data)
				}),
				getuserInfo().then((res) => {
					let [err, data] = res
					// console.log("学生信息为："+JSON.stringify(data) )
					// console.log("学生信息为："+JSON.stringify(data.data.data))
					this.userList = JSON.parse(JSON.stringify(data.data.data))
					// console.log(JSON.parse(JSON.stringify(data.data.data)))
					// console.log(this.userList.realName)
					this.persionList.leaderTeacher = data.data.data.leaderTeacher
					this.persionList.realName = data.data.data.realName
					this.persionList.school = data.data.data.school
					this.persionList.grade = data.data.data.grade
					this.persionList.imageUrl = data.data.data.imageUrl
					this.persionList.phone = data.data.data.phone
					this.persionList.sex = data.data.data.sex
					this.persionList.address = data.data.data.address
				})
			setTimeout(function () {
			            uni.stopPullDownRefresh();
			        }, 1000);
		},
		methods: {
			bj() {
				console.log("ok")
				uni.navigateTo({
					url: '../bjPersion/bjPersion'
				})
			},
			certificate() {
				uni.navigateTo({
					url: '../certificate/certificate?persionalInfo=' + encodeURIComponent(JSON.stringify(this.persionList))
				});
			},
			my_c() {
				uni.navigateTo({
					url: '../my_c/my_c?persionalInfo=' + encodeURIComponent(JSON.stringify(this.persionList))
				});
			},
			mysign() {
				uni.navigateTo({

					url: '../mysign/mysign?persionalInfo=' + encodeURIComponent(JSON.stringify(this.persionList))
				});
			},
			buylist(imageUrl) {
				uni.navigateTo({
					url: '../buylist/buylist?imageUrl=' + imageUrl
				});
			},
			contact() {
				uni.navigateTo({
					url: '../contact/contact'
				});
			},
			houtai() {
				usersRole().then((res) => {
					let [err, data] = res
					console.log("用户信息为：" + JSON.stringify(data.data.data))
					if (data.data.data == "admin") {
						uni.navigateTo({
							url: '../houtai/houtai'
						});
					} else {
						uni.showToast({
							title: '非管理员不能进入！',
							icon: 'none',
							duration: 3000
						})
					}
				})

			},
			simpleup() {
				uni.chooseImage({
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						var name = Math.random().toString(36).slice(-3);
						console.log(tempFilePaths)
						uni.uploadFile({
							url: 'https://exam2.free.qydev.com/uploads/images',
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {
								'imageType': 'FEEDBACK'
							},
							success: (uploadFileRes) => {
								console.log('服务器返回数据：');
								console.log(uploadFileRes.data);
							},
							fail: (uploadFileRes) => {
								console.log(uploadFileRes);
								console.log('上传失败')
							},
							complete: (uploadFileRes) => {
								console.log(uploadFileRes);
								console.log('上传')
							}
						});
					}
				});
			},
			up() {
				uni.chooseImage({
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						const uploadTask = uni.uploadFile({
							url: 'https://exam2.free.qydev.com/uploads/images', //仅为示例，非真实的接口地址
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {
								'imageType': 'FEEDBACK'
							},
							success: (uploadFileRes) => {
								console.log(uploadFileRes.data);
								console.log('上传成功')
							},
							fail: (uploadFileRes) => {
								console.log(uploadFileRes);
								console.log('上传失败')
							},
							complete: (uploadFileRes) => {
								console.log(uploadFileRes);
								console.log('上传')
							}

						});

						uploadTask.onProgressUpdate((res) => {
							console.log('上传进度' + res.progress);
							console.log('已经上传的数据长度' + res.totalBytesSent);
							console.log('预期需要上传的数据总长度' + res.totalBytesExpectedToSend);

							// 测试条件，取消上传任务。
							if (res.progress > 50) {
								uploadTask.abort();
							}
						});
					}
				});
			},
			onShareAppMessage: function(e) {
				let title = '蓝天飞梦小程序'
				return {
					title: title,
					path: 'pages/index/index'
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.percenter {
		width: 96%;
		margin: 0 auto;
		position: relative;

		image {
			width: 100%;
			height: 150px;
			vertical-align: middle;
		}

		.shadow {
			width: 100%;
			height: 60px;
			background-color: rgba(225, 225, 225, .5);
			position: absolute;
			transform: translateY(-50%);
		}

		.photo {
			width: 30%;
			height: 115px;
			position: absolute;
			transform: translateY(-40%);
			right: 20px;
			border: 2px solid #fff;

			image {
				width: 100%;
				height: 100%;
			}
		}

		h3 {
			height: 20px;
			height: 30px;
			line-height: 30px;
			font-size: 14px;
			color: #9a9999;
			font-weight: 900;
			padding-left: 10px;
			background-color: #eee;

		}

		.merbinfo {
			margin: 5px 15px;
			line-height: 20px;

			.title {
				font-size: 14px;
				color: #737272;
			}

			.contd {
				font-size: 14px;
				color: #000000;

			}

			.bottom {
				display: flex;

				view {
					flex: 2;
				}
			}
		}

		.qiang {
			width: 100%;
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			justify-content: space-between;
			// padding: 10px;
			text-align: center;
			margin-top: 50px;
			color: #d6d6d6;
			margin-bottom: 30px;

			view {
				width: 30%;
				height: 100px;
				margin-bottom: 5px;
				position: relative;

				p {
					width: 100%;
					height: 10px;
					border: none;
					position: absolute;
					bottom: 5px;
				}

				image {
					width: 80%;
					height: 80%;
					top: 0;

				}
			}
		}
	}

	.container {
		position: relative;

		.bianji {
			width: 20%;
			padding: 5px;
			position: absolute;
			top: 0;
			right: 8px;
			background-color: #eee;
			z-index: 999;
			opacity: 0.5;
			border-radius: 10%;
			text-align: center;
			color: #000;
			font-weight: 900;
		}
	}
</style>
